<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="任务" prop="reportTCode">
        <el-input
          v-model="queryParams.reportTCode"
          placeholder="请输入任务编号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="工单" prop="reportOCode">
        <el-input
          v-model="queryParams.reportOCode"
          placeholder="请输入工单编号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="报工人" prop="reportPeoCode">
        <el-input
          v-model="queryParams.reportPeoCode"
          placeholder="请输入报工人"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="质检状态" prop="reportQcCode">
        <el-select
          v-model="queryParams.reportQcCode"
          placeholder="请选择状态"
          clearable
        >
          <el-option
            v-for="dict in getQcStatus"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['pro:workReport:remove']"
        >删除
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['pro:workReport:export']"
        >导出
        </el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="proWorkReportList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" fixed />
      <el-table-column type="index" label="序号" align="center" fixed />
      <el-table-column label="任务名称" align="center" prop="reportTCodeName" fixed width="120" show-overflow-tooltip />
      <el-table-column label="任务编号" align="center" prop="reportTCode" fixed width="150" show-overflow-tooltip />
      <el-table-column label="工单名称" align="center" prop="reportOCodeName" width="120" show-overflow-tooltip />
      <el-table-column label="工单编号" align="center" prop="reportOCode" width="150" show-overflow-tooltip />
      <el-table-column label="生产单元名" align="center" prop="reportWCellName" width="120" show-overflow-tooltip />
      <el-table-column label="工艺路线名" align="center" prop="reportRouteName" width="120" show-overflow-tooltip />
      <el-table-column label="工序名称" align="center" prop="reportProcedureName" width="120" show-overflow-tooltip />
      <el-table-column label="工序编号" align="center" prop="reportProcedure" width="150" show-overflow-tooltip />
      <el-table-column label="生产班组名" align="center" prop="reportGroupName" width="120" show-overflow-tooltip />
      <el-table-column label="报工数量" align="center" prop="reportCompleteNum" />
      <el-table-column label="质检时间" align="center" prop="reportTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.reportTime) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="质检数" align="center" prop="reportQcNum" />
      <el-table-column label="合格数" align="center" prop="reportGood" />
      <el-table-column label="合格率" align="center"
      >
        <template slot-scope="scope">
          {{ formatRate(scope.row) }}
        </template>
      </el-table-column>
      <el-table-column label="质检结果" align="center" prop="reportResult" fixed="right">
        <template slot-scope="scope">
          <dict-tag :options="getQualityYesNo" :value="scope.row.reportResult" />
        </template>
      </el-table-column>
      <el-table-column label="状态" align="center" fixed="right">
        <template slot-scope="scope">
          <dict-tag :options="getQcStatus" :value="scope.row.reportQc" />
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="160">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-search"
            @click="handleDetail(scope.row)"
            v-hasPermi="['pro:workReport:query']"
          >查看
          </el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleToQuality(scope.row)"
            v-hasPermi="['pro:workReport:query']"
            v-if="scope.row.reportQc === '0'"
          >质检
          </el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleCalcSal(scope.row)"
            v-hasPermi="['pro:workReport:query']"
            v-if="scope.row.reportQc === '1'"
          >工资结算
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!--    工资结算-->
    <el-dialog title="工资结算" :visible.sync="calcSalDialogVisible">
      <el-form :model="currReport" label-width="90px" label-position="left" size="small">
        <el-form-item label="工单任务" />
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import { delProWorkReport, listProWorkReport } from '@/api/yyj/pro/workReport'
import { parseTime } from '@/utils/ruoyi'
import Decimal from 'decimal.js'

export default {
  name: 'ProWorkReport',
  dicts: ['pro_qc_yes_no', 'qc_quality_yes_no'],
  data() {
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 过程检验表格数据
      proWorkReportList: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        reportCompleteNum: null,
        reportPeoCode: null,
        reportQcCode: null,
        reportQcName: null,
        reportType: null,
        reportQcPeo: null,
        reportQcPeoName: null,
        reportOCode: null,
        reportOCodeName: null,
        reportOBatch: null,
        reportPCode: null,
        reportTCode: null,
        reportTCodeName: null,
        reportWCellName: null,
        reportRouteName: null,
        reportProcedureName: null,
        reportProcedure: null,
        reportGroupName: null,
        reportQcNum: null,
        reportGood: null,
        reportTime: null,
        reportResult: null,
        reportDevCode: null,
        reportDesc: null
      },
      // 工资结算对话框
      calcSalDialogVisible: false,
      // 当前结算工资的报工单
      currReport: {}
    }
  },
  computed: {
    getQcStatus() {
      return this.dict.type.pro_qc_yes_no
    },
    getQualityYesNo() {
      return this.dict.type.qc_quality_yes_no
    }
  },
  created() {
    this.getList()
  },
  methods: {
    // 工资结算
    handleCalcSal(row) {
      console.log('row ', row)
      const reportCode = row.reportCode
      this.$router.push({
        path: `/pro/calc-sal/${reportCode}`
      })
    },
    // 进行质检操作
    handleToQuality(row) {
      const reportCode = row.reportCode
      this.$router.push({
        path: `/pro/report-change/${reportCode}`
      })
    },
    parseTime,
    handleDetail(row) {
      this.$router.push({
        path: `/pro/report-detail/${row.reportCode}`
      })
    },
    // 格式化数字
    formatRate(row) {
      if (!row || !row.reportGood || !row.reportQcNum) {
        return ''
      }
      return new Decimal(row.reportGood).dividedBy(row.reportQcNum).mul(100).toFixed(2) + '%'
    },
    /** 查询过程检验列表 */
    async getList() {
      this.loading = true
      const res = await listProWorkReport(this.queryParams)
      this.proWorkReportList = res.rows
      this.total = res.total
      this.loading = false
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1
      this.getList()
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm('queryForm')
      this.handleQuery()
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.reportCode)
      this.single = selection.length !== 1
      this.multiple = !selection.length
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const reportCodes = row.reportCode || this.ids
      this.$modal.confirm('是否确认删除过程检验编号为"' + reportCodes + '"的数据项？').then(function() {
        return delProWorkReport(reportCodes)
      }).then(() => {
        this.getList()
        this.$modal.msgSuccess('删除成功')
      }).catch(() => {
      })
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download('pro/proWorkReport/export', {
        ...this.queryParams
      }, `proWorkReport_${new Date().getTime()}.xlsx`)
    }
  }
}
</script>
